import Mock from 'mockjs';
import { listPane, chartSaleData, chartComeInData, wordCloudData, chartOrderData, chartPriceData } from '@/api/index/analysis';

export function easyHookData () {
    const chartBarData = ref({}); // echart柱状图数据
    const chartLineData = ref({}); // echart折线图数据
    const chartWordData = ref({}); // echart词云图数据
    const chartSmallLineData = ref({}); // echart折线图数据
    const chartSmallBarData = ref({}); // echart折线图数据
    const paneData = ref([]); //门店销售数据
    const tabActive = ref('salesVolume'); // tab标签
    const time = ref(''); //日期值
    const dateSearch = ref('now'); // 日期类型
    const dateSearchGroup = ref([
        {
            text: '今天',
            value: 'now'
        },
        {
            text: '本周',
            value: 'week'
        },
        {
            text: '本月',
            value: 'month'
        },
        {
            text: '本年',
            value: 'year'
        }
    ]);

    const getPaneList = async () => {
        listPane({ total: 6 }).then(({ data }) => {
            paneData.value = data;
        });
    };

    const getBarChartData = () => {
        chartSaleData({ total: 6 }).then(({ data }) => {
            chartBarData.value = {
                grid: {
                    top: '20px',
                    right: '40px',
                    left: '30px'
                },
                xAxis: {
                    data: data.xAxisData
                },
                series: [
                    {
                        data: data.seriesData,
                        type: 'bar',
                        itemStyle: {
                            color: Mock.mock('@color()')
                        }
                    }
                ]
            };
        });
    };

    const getPriceChartData = () => {
        chartPriceData({ total: 6 }).then(({ data }) => {
            chartSmallBarData.value = {
                grid: {
                    top: '0px',
                    bottom: '0px',
                    right: '0px',
                    left: '0px'
                },
                xAxis: {
                    show: false,
                    data: data.xAxisData
                },
                yAxis: {
                    show: false
                },
                series: [
                    {
                        data: data.seriesData,
                        type: 'bar',
                        itemStyle: {
                            color: Mock.mock('@color()')
                        }
                    }
                ]
            };
        });
    };

    const getLineChartData = () => {
        chartComeInData({ total: 6 }).then(({ data }) => {
            chartLineData.value = {
                grid: {
                    top: '30px',
                    bottom: '20px',
                    right: '20px',
                    left: '40px'
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'shadow'
                    }
                },
                toolbox: {},
                legend: {
                    right: '40px'
                },
                xAxis: {
                    data: data.xAxisData
                },
                seriesData: data.seriesData
            };
        });
    };

    const getOrderLineChartData = () => {
        chartOrderData({ total: 6 }).then(({ data }) => {
            chartSmallLineData.value = {
                grid: {
                    top: '0px',
                    bottom: '0px',
                    right: '0px',
                    left: '0px'
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'shadow'
                    }
                },
                toolbox: {},    
                legend: {
                    right: '40px',
                    show: false
                },
                xAxis: {
                    show: false,
                    data: data.xAxisData
                },
                yAxis: {
                    show: false
                },
                seriesData: data.seriesData
            };
        });
    };

    const getWordCloudData = () => {
        wordCloudData({ total: 6 }).then(({ data }) => {
            chartWordData.value = {
                data: data.seriesData
            };
        });
    };
    return {
        chartBarData,
        chartLineData,
        chartWordData,
        paneData,
        tabActive,
        time,
        dateSearch,
        dateSearchGroup,
        chartSmallBarData,
        chartSmallLineData,
        getPaneList,
        getBarChartData,
        getLineChartData,
        getWordCloudData,
        getOrderLineChartData,
        getPriceChartData,
    };
}
